<template>
  <Submenu :name="parentItem.name">
        <template slot="title">
            <span>{{ parentItem.meta.name || parentItem.name }}</span>
        </template>
        <template v-for="item in parentItem.children">
            <sideMenuItem v-if="item.children&&item.children.length!==0" :parent-item="item" :key="'menu-'+item.name">
            </sideMenuItem>
            <menu-item v-else :name="item.name" :key="'menu-'+item.name" @click.native='jump(item)'>
                <Icon :type="item.meta.icon"></Icon>
                <span>{{item.name}}</span>
            </menu-item>
        </template>
    </Submenu>
</template>

<script>
export default {
  name: 'sideMenuItem',
  props: {
    parentItem: {
      type: Object,
      default: () => {}
    }
  },
  methods: {
    jump ({name}) {
      console.log(name)
      let vm = this
      console.log(vm.$root.hashMenus)
      vm.$router.push({
        name
      })
    }
  }
}
</script>
